<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/9/25 0025
  Time: 上午 11:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
    <title>Title</title>
    <jsp:include page="${pageContext.request.contextPath }/resource_path.jsp" flush="true"/>
</head>
<body class="layui-anim layui-anim-up">
<div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a>
          <cite>房租水电</cite>
        </a>
      </span>
</div>
<div class="x-body">

    <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so" onsubmit="return false">
            <input type="text" name="keyword1" id="keyword1" placeholder="请输入仓库名称" autocomplete="off" class="layui-input">
            <%--<input type="text" name="keyword2" id="keyword2" placeholder="请输入备注" autocomplete="off" class="layui-input">
            <input type="text" name="keyword3" id="keyword3" placeholder="请输入SAP/QAD" autocomplete="off" class="layui-input">
            <input type="text" name="keyword4" id="keyword4" placeholder="请输入中文名称" autocomplete="off" class="layui-input">--%>
            <button class="layui-btn layui-btn-normal" data-type="reload"><i class="layui-icon layui-icon-search"></i>检索</button>
        </form>
    </div>
    <xblock>
        <button class="layui-btn layui-btn-warm" id="add"><i class="layui-icon layui-icon-add-circle-fine"></i>新增</button>
        <button class="layui-btn layui-btn-danger" id="del"><i class="layui-icon layui-icon-delete"></i>批量删除</button>
        <%-- <button class="layui-btn layui-btn-danger" id="import"><i class="layui-icon layui-icon-download-circle"></i>导入</button>
         <button class="layui-btn layui-btn-danger" id="export"><i class="layui-icon layui-icon-upload"></i>导出</button>
         <button class="layui-btn layui-btn-danger" id="dybq"><i class="layui-icon layui-icon-upload-drag"></i>打印标签</button>--%>
    </xblock>


    <table class="layui-hide" id="tableList" lay-filter="tableList"></table>
    <%--<table class="layui-table"  style="float: right" id="testTable">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>仓库</th>
            <th>仓库名称</th>
            <th>供应商合同</th>
            <th>单价</th>
            <th>水费：3%</th>
            <th>电费：13%</th>
            <th>总计</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td rowspan="2">重庆丰树仓库</td>
            <td>一层（蔡家）</td>
            <td>12</td>
            <td>34</td>
            <td>34</td>
            <td>34</td>
            <td>34</td>
        </tr>

        </tbody>

    </table>--%>
</div>
<script>
    $(function(){
        var table=document.getElementById("testTable");//获取table对象
        var rows=table.rows;//获取行对象
        var cells=table.cells;//获取列对象
        var colums = table.rows[0].cells.length;//获取列数
        $(".count").empty();//每次加载时清空最后一列，防止二次加载数据时出现多行合计
        $(".count").append("<td>合计</td>");
        //这里从列开始遍历，得到的就是每一列的数据
        //如果从行开始遍历，得到的就是每行的数据
        for(var j=1;j<colums;j++){
            var sum=0;
            for(var i=1;i<rows.length-1;i++){//从i=1第二行开始去掉表头，rows.length-1结束，去掉合计行
                var a =parseInt(rows[i].cells[j].innerHTML.trim());//获取每一列的值
                sum=sum+a; //计算
            }
            $(".count").append("<td>"+sum+"</td>");//给最后一行添加计算结果列
        }
    });
</script>
<div id="addDivID" style="display:none">
    <form class="layui-form" id="addFormID" style="margin-top:20px">

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">仓库：</label>
                <div class="layui-inline">
                    <select  name="warehouse">
                        <c:forEach items="${warehouseList}" var="warehouse">
                            <option value="${warehouse.id}">${warehouse.warehouse_name}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">供应商：</label>
                <div class="layui-inline">
                    <select  name="supplier">
                        <option value="蔡家">福斯</option>
                        <option value="折旧">泰科</option>
                    </select>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">名称：</label>
                <div class="layui-inline">
                    <select  name="parameter">
                        <c:forEach items="${dicEntity}" var="item">
                            <option value="1">${item.dictLabel}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <div class="layui-inline">
                <label class="layui-form-label">租赁数量：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" name="rentalquantity" style="width: 213px;">                </div>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <div class="layui-inline">
                <label class="layui-form-label">合同数量：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" name="warehousequantity" style="width: 213px;">                </div>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <div class="layui-inline">
                <label class="layui-form-label">单价：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" name="parameter2" style="width: 213px;">                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" id="subBtn" lay-submit lay-filter="addForm">立即提交</button>
                <button  class="layui-btn layui-btn-primary">取消</button>
            </div>
        </div>

    </form>
</div>
<script>
    layui.use('table', function(){
        var table = layui.table;
        var form=layui.form;
        table.render({
            elem: '#tableList'
            ,url: '/hydroPower/list.do' //数据接口
            ,id :'contenttable'
            ,totalRow: true
            ,page: true //开启分页
            ,request: {   //如果无需自定义请求参数，可不加该参数
                pageName: 'page' //页码的参数名称，默认：page
                ,limitName: 'pageSize' //每页数据量的参数名，默认：limit
            }
            ,response: {   //如果无需自定义数据响应名称，可不加该参数
                countName: 'total' //规定数据总数的字段名称，默认：count
                ,dataName: 'rows' //规定数据列表的字段名称，默认：data
            }
            ,cols: [[ //表头

                {type: 'checkbox', fixed: 'left'},
                {field: 'warehouse', title: '仓库', totalRowText: '合计'},
                {field: 'createdate', title: '时间'},
                {field: 'supplier', title: '供应商'}
                ,{field: 'parameter', title: '名称'}
                ,{field: 'rentalquantity', title: '租赁数量'}
                ,{field: 'warehousequantity', title: '供应商合同数量' , totalRow: true}
                ,{field: 'price', title: '单价'}
                ,{field: 'water', title: '水费：3%' , totalRow: true}
                ,{field: 'power', title: '电费：13%' , totalRow: true}
            ]]
            ,done : function(res, curr, count){
                $('th').css({
                    'background-color': '#009688', 'color': '#fff','font-weight':'bold',
                })

                /*$('.layui-table .layui-table-cell > span').css({'font-weight': 'bold'});//表头字体样式
                /!*$('th').css({'background-color': '#5792c6', 'color': '#fff','font-weight':'bold'}) 表头的样式 *!/
                $('th').hide();//表头隐藏的样式
                $('.layui-table-page').css('margin-top','40px');//页码部分的高度调整*/
            }
        });

        var $ = layui.$, active = {
            reload:function(){

                table.reload('tableList', {
                    where: {

                    }
                });
            },
        }

        $('.layui-col-md12 .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        $('.select .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        $("#add").click(function(){
            $("#brand1").hide()
            $("#brand2").hide()

            layer.open({
                type: 1 ,				//Page层类型
                area: ['30%', '60%']
                ,title: '新增'
                ,shade: 0.6 			//遮罩透明度
                ,maxmin: true 			//允许全屏最小化
                ,anim: 1 				//0-6的动画形式，-1不开启
                ,content: $('#addDivID')
                ,success: function(){

                    form.render();
                }

            });
        });

        //批量删除
        $("#del").click(function(){
            var rowData = table.checkStatus('contenttable');
            var data = rowData.data;
            var idArr = new Array();
            if(data.length == 0){
                toastrStyle();
                toastr.warning("请至少选择一条记录！");
            } else {
                for(var i=0;i < data.length;i++){
                    idArr[i] = data[i].id;
                }
                $.ajax({
                    type:'post',
                    url:'${pageContext.request.contextPath }/hydroPower/del.do',
                    data:{"idArr" : idArr},
                    success:function(data){
                        layer.confirm('确定删除吗？', function(){
                            if(data > 0){
                                toastr.success("删除成功！");
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                                setTimeout(function(){
                                    window.location.reload();
                                },2000);
                            }else{
                                toastr.warning("删除失败！");
                                location.reload();
                            }
                        });
                    }
                });
            }
        });

        /**
         * 通用表单提交(AJAX方式)
         */
        form.on('submit(addForm)', function () {

            $("#subBtn").attr("disabled",true);
            $.ajax({
                type:'post',
                url:'${pageContext.request.contextPath }/hydroPower/add.do',
                data:$('#addFormID').serialize(),
                cache:false,
            }).done(
                function(res) {
                    if (res > 0) {
                        toastr.success('新增成功！');
                        setTimeout(function(){
                            location.reload();
                        },1000);
                    }
                }
            ).fail(
                function() {
                    toastr.error('新增失败！');
                    setTimeout(function(){
                        location.reload();
                    },1000);
                }
            )
            return false;
        })

    });
</script>
</body>

</html>
